<!-- eslint-disable vue/multi-word-component-names -->
<template>
  <main>
    <div class="db">
<div>
  <span> <img @click="goBack" class="fanhui" src="../../assets/icon/hdpi/fh.png" alt=""></span>
  <router-link to="message">
    <span><img class="ld" src="../../assets/icon/hdpi/ld.png" alt=""></span>
  </router-link>
</div>
</div>
  <div>
    <van-tabs v-model:active="active" class="tab1">
  <van-tab title="眼科">
    <router-link to="jixun">
      <h3 class="yan1">急寻:面神经炎的治疗方法</h3>
      <p class="yan2" style="margin-top: 5px;">周围性神经炎,下巴斜的,口齿不清,眼镜闭合不了,右边脸明显动不了</p>
      <p class="yan3" style="float: right; margin-top: 5px;">2018-12-18 12:38</p>
    </router-link>
    <div class="yan" style="margin-top: 20px;">
      <span style="font-size: 19px;">急性肠胃炎怎么办</span>
      <span><img style="float: right; width: 40px; height: 25px;" src="../../assets/icon/hdpi/ershi.png" alt=""></span>
      <p style="margin-top: 5px;">去年肠胃炎犯了,经过输液,吃药好了,现在的问题是:不能吃油腻的东西了,炒菜的油多了也不行,吃了就感觉恶心,想呕吐,但是吐不出来,请问这是什么情况</p>
      <p style="float: right; margin-top: 2px;">2018-12-18 12:38</p>
    </div>
    <div class="yan" style="margin-top: 30px;">
      <h3>感冒了医生说脾胃不好造成的</h3>
      <p style="margin-top: 5px;">去年脾胃发炎了,经过输液,吃药好了,现在的问题是:不能吃油腻的东西了,炒菜放的油多了也不行,吃了就感觉恶心,想呕吐,但是吐不出来,请问这是什么情况</p>
      <p style="float: right; margin-top: 10px;">2018-12-18 18:42</p>
    </div>
     <div class="yan" style="margin-top: 30px;">
      <h3>急寻:面神经炎的治疗方法</h3>
      <p style="margin-top: 5px;">周围性神经炎,下巴斜的,口齿不清,眼镜闭合不了,右边脸明显动不了</p>
      <p style="float: right; margin-top: 10px;">2018-12-18 12:28</p>
    </div>
  </van-tab>
  <van-tab title="骨科" class="tab2">
    
    <div class="yan" style="margin-top: 30px;">
      <h3>感冒了医生说脾胃不好造成的</h3>
      <p style="margin-top: 5px;">去年脾胃发炎了,经过输液,吃药好了,现在的问题是:不能吃油腻的东西了,炒菜放的油多了也不行,吃了就感觉恶心,想呕吐,但是吐不出来,请问这是什么情况</p>
      <p style="float: right; margin-top: 10px;">2018-12-18 18:42</p>
    </div>
     <div class="yan" style="margin-top: 30px;">
      <h3>急寻:面神经炎的治疗方法</h3>
      <p style="margin-top: 5px;">周围性神经炎,下巴斜的,口齿不清,眼镜闭合不了,右边脸明显动不了</p>
      <p style="float: right; margin-top: 10px;">2018-12-18 12:28</p>
    </div>
  </van-tab>
  <van-tab title="小儿科" class="tab3">
     <div class="yan" style="margin-top: 30px;">
      <h3>急寻:面神经炎的治疗方法</h3>
      <p style="margin-top: 5px;">周围性神经炎,下巴斜的,口齿不清,眼镜闭合不了,右边脸明显动不了</p>
      <p style="float: right; margin-top: 10px;">2018-12-18 12:28</p>
    </div>
  </van-tab>
  <van-tab title="急诊科">内容 </van-tab>
  <van-tab title="皮肤性病">内容 4</van-tab>
</van-tabs>
  </div>
  </main>
</template>
<script setup lang="ts">

import { ref } from 'vue';
import { useRouter } from 'vue-router'; 

    const router = useRouter();  
function goBack() {  
      // 使用router.go(-1)模拟浏览器的后退操作  
      router.push('/home')  
    }  
      const active = ref(0);

</script>
<style>
.fanhui{
  width: 20px;
  height: 20px;
 position: absolute;
 left: -15px;
}
.db{
  width: 100vw;
  position: relative;
  left: 1px;
  height: 50px;
}
.ld{
  width: 20px;
  height: 20px;
  margin-left: 280px;
}
.yan{
  margin-left: 20px;
}
.tab1{
  position: absolute;
  left: -30px;
  top: -30px;
}
.yan{
  width: 100%;
  height: 100px;
  margin-top: 5px;
}
.yan p{
  font-size: 12px;
}
.yan1{
  margin-left: 20px;
  color: #000;
}
.yan2{
  margin-left: 20px;
  color: #000;
  font-size: 12px;
}
.yan3{
  font-size: 12px;
  color: #000;
}

</style>